import { makeObservable } from "mobx";

import type { CEComponentType } from "@/components/app/earth3dVis";
import type { SimulationStore } from "./index";

export class MainNetworkStore{
    private readonly simulationStore: SimulationStore;

    constructor(simulationStore: SimulationStore) {
        this.simulationStore = simulationStore;
        makeObservable(this,{})
    }

    /**
     * 渲染主干网络
     */
    renderNetwork = () => {
        const { gisMapStore, initData} = this.simulationStore;
        const { CE, viewer} = gisMapStore.cesiumUtil;
        const layer = new CE.VectorLayer("layer");

        const idToBillboard: {[index: string]: CEComponentType["Billboard"] | CEComponentType["Model"]} = {};

        // 1. 渲染站点
        initData.mainNetwork.siteList.forEach(({id, name, position}) => {
            const renderer = initData.mainNetwork.siteRenderer;
            let siteOverlay: CEComponentType["Billboard"] | CEComponentType["Model"];
            if(renderer.type == "image") {
                siteOverlay = new CE.Billboard(new CE.Position(position.lng, position.lat), renderer.sourceUrl);
                siteOverlay.size = [30, 40];
                siteOverlay.setStyle({
                    color: CE.Color.BLUE
                })
            }else if(renderer.type == "gltf"){
                siteOverlay = new CE.Model(new CE.Position(position.lng, position.lat), renderer.sourceUrl);
            }
            siteOverlay.id = id;

            const label = new CE.Label(new CE.Position(position.lng, position.lat), name)
            label.setStyle({
                fillColor: CE.Color.YELLOW,
                font: '1px Helvetica',
                pixelOffset: new CE.Cartesian2(0, 25)
            });
            label.id = id;

            idToBillboard[id] = siteOverlay;
            layer.addOverlay(label)
            layer.addOverlay(siteOverlay)
        });

        // 2. 关联站点关系
        Object.keys(initData.mainNetwork.siteRelation).forEach((sourceSiteId) => {
            const source = idToBillboard[sourceSiteId];
            const distSiteIdList = initData.mainNetwork.siteRelation[sourceSiteId];
            distSiteIdList.forEach((distSiteId) => {
                const dist = idToBillboard[distSiteId];
                let polyline = new CE.Polyline([source.position, dist.position])
                polyline.setStyle({
                    width: 5,
                    // material: new CE.PolylineLightingTrailMaterialProperty({
                    material: new CE.PolylineLightingMaterialProperty({
                        color: CE.Color.YELLOW,
                        // speed: 10.0
                    }),
                    clampToGround: true
                })

                layer.addOverlay(polyline)
            })
        });

        viewer.addLayer(layer);
    }
}